/**
 * Created by Dick on 2016/3/29.
 */
$(function () {
    "use strict";
    if (document.getElementById('pic-send')) {
        document.getElementById('pic-send').addEventListener('change', handleFileSelect, false);
    }
    if (document.getElementById('pic-send2')) {
        document.getElementById('pic-send2').addEventListener('change', handleFileSelect2, false);
    }



    $('#delpic').on('click', function () {
        var picid = $('img[data-role="attachment"]').data('id');
        $.ajax({
            url: 'UpLoad/delpicture',
            type: 'post',
            data: {
                id: picid
            },
            success: function (result) {
                if (result.code == 200) {
                    $('#pic-show').empty();
                    $('#pic-container').hide();
                }
            }
        });
    });
    $('#delpic2').on('click', function () {
        var picid = $('img[data-role="attachment"]').data('id');
        $.ajax({
            url: 'UpLoad/delpicture2',
            type: 'post',
            data: {
                id: picid
            },
            success: function (result) {
                if (result.code == 200) {
                    $('#pic-show2').empty();
                    $('#pic-container2').hide();
                }
            }
        });
    });
    //$('.input-miss').on('change', function () {
    //
    //    var picid = $('img[data-role="attachment"]').data('id');
    //    if (picid != '') {
    //        $('input[name="img"]').value = picid;
    //    } else {
    //        $('input[name="img"]').value = '';
    //    }
    //});

    //$('#pic-show').click(function () {
    //    alert('123');//todo 放大图片
    //});
    var jic = {
        compress: function (source_img_obj, quality, output_format) {
            var mime_type = "image/jpeg";
            if (output_format != undefined && output_format == "png") {
                mime_type = "image/png";
            }

            var cvs = document.createElement('canvas');
            //naturalWidth真实图片的宽度
            cvs.width = source_img_obj.naturalWidth;
            cvs.height = source_img_obj.naturalHeight;
            var ctx = cvs.getContext("2d");
            ctx.clearRect(0, 0, cvs.width, cvs.height);
            ctx.drawImage(source_img_obj, 0, 0, cvs.width, cvs.height);
            var newImageData = cvs.toDataURL(mime_type, quality);
            var result_image_obj = new Image();
            result_image_obj.src = newImageData;
            return result_image_obj;
        }
    };

    function handleFileSelect(evt) {
        var files = evt.target.files;
        for (var i = 0, f; f = files[i]; i++) {
            // Only process image files.
            if (!f.type.match('image.*')) {
                continue;
            }

            var reader = new FileReader();
            // Closure to capture the file information.
            reader.onload = (function (theFile) {
                return function (e) {
                    var size = files[0].size;
                    var p = new Image();
                    p.src = e.target.result;
                    var quality = 0.95;
                    var maxsize = 0.8 * 1024 * 1024;
                    if (size > maxsize) {
                        quality = maxsize / size;
                    }
                    var thefile = jic.compress(p, quality).src;

                    //获取上传文件的File对象
                    var data = new FormData();

                    //酱上传文件添加到FormData对象里
                    data.append('file', thefile);
                    $.ajax({
                        url: 'UpLoad/upload',
                        type: 'post',
                        data: data,
                        cache: false,//上传文件不需要缓存
                        processData: false,//data 是FormData对象，不需要对数据处理
                        contentType: false,//已经声明了enctype="multipart/form-data"，所以设置为false
                        success: function (result) {
                            if (result.code != 200) {
                                return;
                            }

                            var html = '';
                            //
                            $('#pic-container').show();
                            html += '<img data-role="attachment" data-id="' + result.data.id + '" src="' + result.data.path + '"><input type="hidden" name="img" value="' + result.data.id + '">';
                            $('#pic-show').html(html);

                        }
                    });
                };
            })(f);
            // Read in the image file as a data URL.
            reader.readAsDataURL(f);
        }
    }

    function handleFileSelect2(evt) {
        var files = evt.target.files;
        for (var i = 0, f; f = files[i]; i++) {
            // Only process image files.
            if (!f.type.match('image.*')) {
                continue;
            }

            var reader = new FileReader();
            // Closure to capture the file information.
            reader.onload = (function (theFile) {
                return function (e) {
                    var size = files[0].size;
                    var p = new Image();
                    p.src = e.target.result;
                    var quality = 0.95;
                    var maxsize = 0.8 * 1024 * 1024;
                    if (size > maxsize) {
                        quality = maxsize / size;
                    }
                    var thefile = jic.compress(p, quality).src;

                    //获取上传文件的File对象
                    var data = new FormData();

                    //酱上传文件添加到FormData对象里
                    data.append('file', thefile);
                    $.ajax({
                        url: 'UpLoad/upload2',
                        type: 'post',
                        data: data,
                        cache: false,//上传文件不需要缓存
                        processData: false,//data 是FormData对象，不需要对数据处理
                        contentType: false,//已经声明了enctype="multipart/form-data"，所以设置为false
                        success: function (result) {
                            if (result.code != 200) {
                                return;
                            }

                            var html = '';
                            //
                            $('#pic-container2').show();
                            html = '<img data-role="attachment" data-id="' + result.data.id + '" src="' + result.data.path + '"><input type="hidden" name="img" value="' + result.data.id + '">';
                            $('#pic-show2').html(html);

                        }
                    });
                };
            })(f);
            // Read in the image file as a data URL.
            reader.readAsDataURL(f);
        }
    }
});